
$out-margin:margin-left;   

html::-webkit-scrollbar {
    display: none;
  }


  //page-1

  #pureHeart-page_1{
    background:url("https://dotlinkface-tmpl.oss-cn-shanghai.aliyuncs.com/pureheart/pureHeart-23.jpg");
    background-repeat: repeat;
    z-index: -1;
}

//pc-section1-header

.pureHeart-header{
    background:url("https://dotlinkface-tmpl.oss-cn-shanghai.aliyuncs.com/pureheart/pureHeart-23.jpg");
    background-repeat: repeat;
    padding-bottom: 0.417em
}
.pureHeart-header-img1{
    width: 0.783em;
	height: 0.833em;
    margin:0.98em auto; 
}
.pureHeart-header-img2{
    width: 3.367em;
	height: 0.433em;
    margin-top: 0.3em;
    margin-left: 0.333em;
}
.pureHeart-header-img3{
    width: 3.167em;
    height: 0.6em;
    margin-top: 0.317em;
    margin-left: 4.717em;
}

// nav

.pureHeart-nav-box .iconfont.icon-daohang1{
    font-size: 25px;
    display: inline-block;
}
.pureHeart-nav-box{
    margin-left: 7.633em;
    cursor: pointer;
    height: 1em;
}
.pureHeart-nav {
    width: auto;
    height: auto;
    margin-left: -2.26em;
    margin-top: -1.4em;
    border: 1px solid #cccccc;
    background: white;
    z-index: 1;
    position: relative
}

.template-nav{
    margin-top: -0.8em;
    width: auto;
    height: auto;
}

.template-nav .icon-quxiao{
    display: inline-block;
    z-index: 99;
    margin-top: 10px;
    margin-left: -10px;
    font-size: 16px;
    position: relative;
}


.pureHeart-nav .navbar-nav{
    box-sizing: content-box;
    position: relative;;
    display: flex;
    width: 2.5em;
    height: auto;
    background-color: #ffffff;
    flex-direction:column;
    z-index: 10;
}
.pureHeart-nav .navbar-nav li{
    height: 0.5em;
    overflow: visible;
    .p-button-wrap a{
        font-size: 14px;
        &:hover{
            color:#c40422
        }
    }
    margin:0 auto;
    width: 1.667em;
    border-bottom: 1px solid #d3d3d3;
}

.p-navpage .navbar-nav li:last-child{
    margin:0.2em auto;
    border-bottom: 1px solid transparent;
    padding-bottom: 0.5em;

}
.p-navpage .navbar-nav li:first-child{
    margin-top: 0.29em
}
.p-navmobile .p-navbar span.icon-quxiao{
    margin-left: 14.5em
}

// pc-section-2-screen

.pureHeart-header-img5{
    width: 100%;
	height: 6.667em;
    z-index: 0;
}
.pureHeart-hearder-box-warper{
    position: relative;
    width: 10.3em;
    background-color:rgba(211,211,211,0.5) ;
    // margin-left: 4.896em;
    padding-bottom: 0.15em;
    margin: -0.45em auto; 
    z-index: 100;
    height: auto;
}
.pureHeart-header-box-in{
    width: 10em;
    background-color: #ffffff;
    padding-bottom: 0.4em;
    margin-left: 0.15em;
    height: auto;

}
.pureHeart-heart-text1{
    font-family: PingFangSC-Regular;
    .p-text-wrap{
        font-size: 14px;
    }
    color: #010000;
    
    margin-top: 0.4em;
    width: 100%;
    text-align: center;

}
.pureHeart-heart-text2{
    @extend .pureHeart-heart-text1;
    margin-top: 0.12em;
 
}


// pc-section-2-story

    .pureHeart-story-img1{
        width: 0.6em;
        height: 0.667em;
        #{$out-margin}:8.517em-6em;
        margin-left: 1.017em;
        margin-top: 2em
    }
    .pureHeart-story-img2{
        width: 0.75em;
        height: 0.5em;
        margin-left: 0.25em;
        margin-top: 2.1em
    }
    .pureHeart-story-img3{
        width: 0.717em;
        height: 0.55em;
        margin-left: 0.25em;
        margin-top: 2em
    }
    .pureHeart-story-img4{
        width: 0.567em;
        height: 0.78em;
        margin-left: 0.25em;
        margin-top: 2em
    }
.pureHeart-story-text1{
    width: auto;
    font-family: Marion-Regular;
    .p-text-wrap{
        font-size: 12px;
    }
    color: #c40422;
    #{$out-margin}:9.1em-6em;
    margin-left: 1.6em;
    margin-top: 0.167em
}
.pureHeart-story-text3{
    margin-left:-2em 
}
.pureHeart-story-text-common{
    width: 10.517em;
    font-family: PingFangSC-Regular;
    .p-text-wrap{
        font-size: 16px;
    }
    color: #444444;
    margin-left: 1em;
    margin-top: 0.3em
}

.pureHeart-story-text4{
    width: 15em;
}

.pureHeart-story-text2{
    margin-top: 0.633em
}
.pureHeart-story-img-add{
	width: 7.583em;
	height: 6.567em;
    margin-left:-2.5em;
}

// pc-full-img

.pureHeart-full.zero-grid-row:nth-child(1){
    width: 100%
}
.pureHeart-story-img-common{
    width: 50%;
	height: 3.646em;
}



.pureHeart-story-img-common .p-layout-inner{
    z-index: 99;
}


//common-start
.pureHeart-story-box{
    width: 1.875em;
    border: solid 0.021em #ffffff;
    padding-bottom: 0.147em;
    z-index: 10
}
.pureHeart-story-box-text1{
    font-family: PingFangSC-Semibold;
    .p-text-wrap{
        font-size: 16px;
    }
	color: #ffffff;
    width: 100%;
    text-align: center;
    margin-top: 0.167em
}
.pureHeart-story-box-text2{
    font-family: Marion-Regular;
    .p-text-wrap{
        font-size: 12px;
    }
    color: #ffffff;
    width: 100%;
    text-align: center;
    margin-top: 0.04em;
}
//common-end

.pureHeart-story-box1{
    margin-top: -5.95em;
    margin-left:4.099em;
}
.pureHeart-story-box2{
    margin-top: -5.95em;
    margin-left: 8.198em
}
.pureHeart-story-box3{
    margin-top: -2.3em;
    margin-left:4.099em;
}
.pureHeart-story-box4{
    margin-top: -2.3em;
    margin-left: 8.198em
}
.pureHeart-story-box:hover{
    background-color: #c40422;
    border: solid 0.033em transparent;
}

.p-button.pureHeart-story-link{
    position: relative;
    width: 180px;
	height: 60px;
    text-align: center;
    border: solid 2px #ffffff;
    background: transparent;
    color: #ffffff;

    margin: 0 auto;
    margin: 0 auto;
    margin-top: calc( 1.823em - 30px );

}
.p-button.pureHeart-story-link:hover{

    background-color: #c40422;
    border: solid 2px transparent;

}

// pc-section-3-experience

#pureHeart-3{
    background: url("https://dotlinkface-tmpl.oss-cn-shanghai.aliyuncs.com/pureheart/pureHeart-24.jpg");
    background-repeat: repeat;
    padding-bottom: 1.05em;
}
.pureHeart-experience-img1{
    width: 0.375em;
	height: 0.417em;
    margin-left: 8.95em;
    margin-top:1.04em
}
.pureHeart-experience-img2{
    width: 0.365em;
	height: 0.25em;
    margin-left: 0.15em;
    margin-top: 1.135em
}
.pureHeart-experience-img3{
    width: 0.448em;
	height: 0.49em;
    margin-left: 0.15em;
    margin-top: 0.958em
}
.pureHeart-experience-img4{
    width: 0.417em;
	height: 0.396em;
    margin-left: 0.15em;
    margin-top: 1.021em
}
.pureHeart-experience-text1{
    @extend .pureHeart-story-text1;
   width: 100%;
   text-align: center;
   margin-left: 0;
   margin-top: 0.06em
}


//experience-box

.pureHeart-experience-box{
    width: 15em;
    background-color:#ffffff;
    margin: 0.52em auto;
    padding-bottom: 0.698em;
    height: auto;
}

.pureHeart-experience-box-img-common{
    width: 0.552em;
	height: 0.552em;
}
.pureHeart-experience-box-text1{
    width: auto;
    font-family: PingFangSC-Medium;
    .p-text-wrap{
        font-size: 18px;
    }
    color: #010000;
    margin-top: 0.09em
}
.pureHeart-experience-box-text2{
    width: auto;
    font-family: PingFangSC-Regular;
    .p-text-wrap{
        font-size: 14px;
    }
    color: #888888;
    margin-top: 0.135em
}
.pureHeart-experience-box-text3{
    width: auto;
    font-family: PingFangSC-Regular;
    .p-text-wrap{
        font-size: 14px;
    }
    color: #666666;
    margin-top: 0.14em
}
.pureHeart-experience-box-text4{
    width: auto;
    font-family: PingFangSC-Regular;
    .p-text-wrap{
        font-size: 14px;
    }
    color: #c40422;
    margin-top: 0.15em
}

.pureHeart-experience-box1-img{
    margin-top: 0.667em;
    margin-left: 0.771em
}
.pureHeart-experience-box2-img{
    margin-top: 0.667em;
    margin-left: 0.531em
}
.pureHeart-experience-box3-img{
    margin-left: 0.771em;
    margin-top: 0.313em
}
.pureHeart-experience-box4-img{
    margin-top: 0.313em;
    margin-left: 0.531em
}
.pureHeart-experience-box5-img{
    margin-left: 0.771em;
    margin-top: 0.313em
}
.pureHeart-experience-box6-img{
    margin-top: 0.313em;
    margin-left: 0.531em
}
#pureHeart-3 .pureHeart-experience-box .zero-grid-row:first-child .zero-grid-column{
    width: 5.77em !important;
    margin-top: 0.667em;
    margin-left: 0.198em
}
#pureHeart-3 .pureHeart-experience-box .zero-grid-row:nth-of-type(2) .zero-grid-column{
    width: 5.77em !important;
    margin-top: 0.3em;
    margin-left: 0.198em
}
#pureHeart-3 .pureHeart-experience-box .zero-grid-row:nth-of-type(3) .zero-grid-column{
    width: 5.77em !important;
    margin-top: 0.3em;
    margin-left: 0.198em
}
#pureHeart-3 .pureHeart-experience-box .zero-grid-row:nth-of-type(4) .zero-grid-column{
    width: 5.77em !important;
    margin-top: 0.3em;
    margin-left: 0.198em
}
//pc-section-3-product

#pureHeart-4 .zero-grid-row:nth-child(3){
    width: 100%
}
#pureHeart-4 .zero-grid-column{
    position: relative;
    width: 20% !important;
    height: 4em;
    margin-top: 0.5em;
}
.pureHeart-product-img1{
    width: 2.031em;
	height: 0.417em;
    margin:1.052em auto
}
.pureHeart-product-text1{
    @extend .pureHeart-story-text1;
    width: 100%;
    text-align: center;
    margin-left: 0
}
.pureHeart-product-img-common {
    width: 100%;
    height: 4em;
}
.pureHeart-product-box{
     width: 100%;
     position: absolute;
     background-color: #332c26;
     text-align:center;
     padding-bottom: 0.18em;
     margin-top: -1.333em;
     opacity: 0;
     bottom: 0;
     z-index: 10;
     height: auto;
}
.pureHeart-product-box-text1-common{
    width: auto;
    font-family: PingFangSC-Semibold;
    .p-text-wrap{
        font-size:16px
    }
	color: #ffffff;
    margin-top:0.24em;
}
.pureHeart-product-box-text2-common{
    width: auto;
    
    font-family: PingFangSC-Regular;
	 .p-text-wrap{
        font-size:14px
    }
	color: #b0adaa;
    margin-top:0.1em
}

.pureHeart-product-box-link.p-button {
    width: 0.729em;
	height: 0.292em;
    background-color: transparent;
    margin:0.18em auto;
    color: #ffffff;
    border: 1px solid #b0adaa
}
.pureHeart-product-box:hover{
   opacity: 1;
}
.pureHeart-product-link{
    width: 1.875em;
    border: solid 0.033em #332c26;
    text-align: center;
    margin:0.42em auto;
    padding-bottom: 0.14em;
    height: auto;
}
.pureHeart-product-link-text1{
    width: auto;
    font-family: PingFangSC-Semibold;
    .p-text-wrap{
        font-size: 16px;
    }
    color: #010000;
    margin-top: 0.16em
}
.pureHeart-product-link-text2{
    width: auto;
    font-family: Marion-Regular;
    .p-text-wrap{
        font-size: 12px;
    }
    color: #666666;
    margin-top: 0.04em
}


// pc-section-4-contact
#pureHeart-4{
    padding-bottom:0em
}
.pureHeart-contact-img1{
    width: 0.717em;
    height: 0.65em;
    #{$out-margin}:14.383em-6em;
    margin-top: 1.85em
}
.pureHeart-contact-img2{
    width: 0.567em;
    height: 0.633em;
    margin-top: 1.85em;
    margin-left: 0.233em
}
.pureHeart-contact-img3{
    width: 0.6em;
    height: 0.667em;
    margin-top: 1.833em;
    margin-left: 0.233em
}
.pureHeart-contact-img4{
    width: 0.75em;
    height: 0.5em;
    margin-top: 1.983em;
    margin-left: 0.233em
}
.pureHeart-contact-text1{
    width: 100%;
    text-align: center;
    margin-left: 0;
}
.pureHeart-contact-img5{
    height: 11.817em;
    width: 15em;
    margin-top: 0.95em;
    margin-left: 1.49em
}


//footer
.pureHeart-footer{
    background:url("https://dotlinkface-tmpl.oss-cn-shanghai.aliyuncs.com/pureheart/pureHeart-23.jpg");
    background-repeat: repeat;
    padding-bottom: 0.6em;
}

.pureHeart-footer-text1.p-button[data-theme="theme-15"]{
    width: auto;
    font-family: PingFangSC-Regular;
    .p-button-wrap a{
        font-size: 12px;
    }
    width: auto;
    font-family: PingFangSC-Regular;
    color: #010000;
    background-color: transparent;
    margin-left: 16px;
    margin-top: 1.3em;
}

.pureHeart-footer-text1_1.p-button[data-theme="theme-15"]{
    margin-left: 5.1em;
}

.pureHeart-footer-text2{
    width: auto;
    font-family: PingFangSC-Regular;
    .p-text-wrap{
        font-size: 12px;
    }
    color: #010000;
    background-color:transparent;
    margin-left: 10px;
    margin-top: 1.25em
}

.pureHeart-footer-text3{
    width: auto;
    text-align: center;
    margin-top: 0.2em
}

@media screen and (max-width:991px){
    
    .pureHeart-story-img-add{
        margin-top: 1em;
        margin-left: -5.15em;
    }
}

@media screen and (max-width:767px){
    
    //nav
    .p-navmobile li .p-button .p-button-wrap a{
        font-size: 14px
    }
    //mobile-section1-header
    .p-navmobile .p-navbar span{
        font-size: 1.5em;
    }

    .p-navmobile.it-mobile-nav{
        margin-top: 0.9em
    }

    .pureHeart-header-img3{
        width: 3.958em;
        height: 0.75em;
        margin-top: 1em;
        margin-left: 1em
    }

    .pureHeart-header-img1{
        width: 1.13em;
        height: 1.278em;
        margin-left: 0.741em;
        margin-top: 0.704em
    }

    .pureHeart-header-img2{
        width: 6.093em;
        height: 0.778em;
        margin-left: 0.741em;
    }
    .pureHeart-header-img5{
        width: 18.5em;
        margin:0 auto
    }
    .pureHeart-hearder-box-warper{
        width: 17em;
        margin-top: -1em;
        padding-bottom: 0.2em
    }
    .pureHeart-header-box-in{
        width: 17.037em;
        margin-left: 0.18em;
    }
    .pureHeart-hearder-box-warper{
        width: 17.37em;
        margin-left: 1.315em;
    }
    .pureHeart-heart-text1{
        .p-text-wrap{
            font-size: 14px
        }
    }
    .pureHeart-heart-text2{
        width: auto;
        margin:0.1em 1.5em;
        .p-text-wrap{
            font-size: 14px
        }
    }

     //mobile-section2-story
    .pureHeart-story-img1{
        width: 1.093em;
	    height: 1.278em;
        margin-left: 1.5em
    }
    .pureHeart-story-img2{
        width: 1.074em;
        height: 0.759em;
        margin-top: 2.3em
    }
    .pureHeart-story-img3{
        width: 1.352em;
        height: 1.056em;
    }
    .pureHeart-story-img4{
        width: 1.074em;
	    height: 1.463em;
    }
    .pureHeart-story-text1{
        width: auto;
        margin-left: 1.5em
    }
  
    .pureHeart-story-text-common{
        width: auto;
        margin-left: 0
    }
    .pureHeart-story-img-common{
        width: 18.5em;
        height:8em;
        margin: 0 0.725em;
    }

    .pureHeart-story-link.p-button[data-theme="theme-15"]{
        margin-top: calc( 4em - 30px );
    }

    .pureHeart-story-box{
        position: relative;
        margin: -6.5em auto;
        width:12em;
        z-index:100;
    }
    .pureHeart-story-text-common{
        margin-left: 1.5em
    }
    .pureHeart-story-text2, .pureHeart-story-text3, .pureHeart-story-text4{
        width: 17.5em;
        margin-top: 0.5em;
    }
    .pureHeart-story-img-add{
        width: 8em;
	    height: 7em;
        margin-left: 11em;
        margin-top: -1em
    }

    // .pureHeart-story-link.p-button{
    //     position: relative;
    //     margin: -7.1em auto;
    // }


     //mobile-section3-experience

     .pureHeart-experience-text1{
         text-align: center;
         margin-left: 0.2em;
         margin-top: 0.2em  
     }

     .pureHeart-story-text-common .p-text-wrap{
        font-size: 14px;
     }

     #pureHeart-3{
        padding-bottom: 2em;
        margin-top: -4em
     }
    .pureHeart-experience-img{
        width: 1.5em;
        height: 1.5em;
        margin-top: 5em
    }
    .pureHeart-experience-img2{
        height: 0.9em;
        margin-top: 5.5em
    }
    .pureHeart-experience-img1{
        margin-left: 7em
    }
    .pureHeart-experience-box{
        width: 18.5em;
        margin-left: 0.725em;
        height: auto;
    }
    #pureHeart-page_1 #pureHeart-3 .pureHeart-experience-box .zero-grid-row .zero-grid-column{
        width: 13.981em;
        margin-top:1.8em;
        margin-left: 0.407em
    }
    .pureHeart-experience-box-text1{
        width: auto
        // margin-top: 2em;
        // margin-left: 1em
    }
    .pureHeart-experience-box-text2{
        width: auto
        // margin-left: 1em
    }
    .pureHeart-experience-box-img-common{
        width: 2.5em;
        height: 2.5em;
        margin-left: 1em;
        margin-top: 2em
    }
    .pureHeart-experience-box-text3{
        width: auto;
        .p-text-wrap{
            width: 18em;
        }

    }
    .pureHeart-experience-box-text4{
        width: auto;
        .p-text-wrap{
            width: 18em;
        }
    }

     //mobile-section4-product

    #pureHeart-4{
        padding-bottom: 3em
    }
     .pureHeart-product-text1{
         width: 100%;
         text-align: center;
         margin-left: 0
     }
     .pureHeart-product-box1-text2{
         .p-text-wrap{
             font-size: 12px
         }
     }
     .pureHeart-product-img1{
         width: 7em;
         height: 1.3em;
         margin-left: 6.4em
     }
     .pureHeart-product-img-common{
         width:50%;
         height: 10em;
         margin-left: 0;
         margin-top: 0
     }
     .pureHeart-product-img5,.pureHeart-product-img6{
         margin-top: 1.093em
     }
     .pureHeart-product-box{
         position: relative;
         z-index: 100;
         width:50%;
         opacity: 1;
         margin: -4.4em auto
     }
     .pureHeart-contact-img-common{
         width: 1em;
         height: 1em;
     }
     .pureHeart-product-link{
         width: 8em;
         margin-top: -5.889em;
         margin-left: 11.315em
     }
    
      //mobile-section5-contact

      .pureHeart-contact-text1{
          width: 100%;
          text-align: center;
          margin-left: 0
      }
     .pureHeart-contact-text2{
         margin-left: 1em;
         margin-top: 2em;
     }
     .pureHeart-contact-text3{
        width: 16em;
         margin:1em auto
     }
     //mobile-footer
     .pureHeart-footer-text1,.pureHeart-footer-text2{
         
         margin-top: 1.2em;
     }

     .pureHeart-footer-text1.p-button[data-theme="theme-15"]{
        margin-left: 0;
        width: 5em;
        text-align: center;
    }



    .margin-2{
        margin-top: 0.4em;
    }


    .margin-2.p-button[data-theme="theme-15"]{
        margin-top: 20px;
    }

     .pureHeart-footer-text3{
         margin-top: 1em;
         .p-text-wrap{
             font-size: 12px
         }
         width: 100%;
         margin-left: 0%;
         text-align: center
     }
}







// page2-section-1

.page2-common-top-text1{
    font-family: PingFangSC-Semibold;
    .p-text-wrap{
        font-size: 20px;
    }
    color: #000000;
    width: 100%;
    text-align: center;
    margin-top: 1.283em
}
.page2-common-top-text2{
    font-family: Marion-Regular;
    .p-text-wrap{
        font-size: 12px;
    }
    color: #888888;
    width: 100%;
    text-align: center;
    margin-top: 0.2em
}
.pureHeart-quality-text3{
    font-family: PingFangSC-Regular;
    .p-text-wrap{
        font-size: 14px;
    }
    color: #000000;
    width: 100%;
    text-align: center;
    margin-top: 0.667em
}
.pureHeart-quality-text4{
    @extend .pureHeart-quality-text3;
    margin-top: 0.15em
}

// page2-section-2

.pureHeart-people-text1 {
    margin-top: 1.317em
}
.pureHeart-imglist1{
    margin-top: 0.25em;
    margin-left: 0.5em
}
.img-item{
    margin-top: 0.433em;
    .p-pic{
        height: 3.422em;
        :hover{
            border: solid 3px #cd0000;
        }
    }
}
.p-imgsection .imgsection-content{
    height: auto
}
// page2-section-3
.pureHeart-principle-text1{
    margin-top: 1.317em
}
.pureHeart-principle-img{
    width: 1.333em;
    height: 1.333em;
    margin-left: 1.133em;
    margin-top: 0.617em
}
.pureHeart-principle-img1{
    margin-left: 1.317em
}
.pureHeart-principle-text{
    width: 1.8em;
    font-family: PingFangSC-Regular;
    .p-text-wrap{
        font-size: 14px;
    }
    color: #000000;
    margin-top: 0.35em;
    margin-left: 0.6em;
    text-align: center;
}
.pureHeart-principle-text3{
    margin-left: 1.183em
}
.pureHeart-principle-box{
    width: 1.8em;
    text-align: center;
    margin-left: 0.7em;
    margin-top: 0.35em;
    height: auto;
}
.pureHeart-principle-box-text1{
    width: auto;
}
.pureHeart-principle-box-text2{
    width: auto;
}
// page2-section-4
.pureHeart-imglist2{
    margin-top: 0.25em;
    margin-left: 0.5em;
    padding-bottom: 1.017em
}

// page2-mobile

@media screen and (max-width:767px){
     //mobile-section1
    #pureHeart-page_2-section1{
        margin-top: 0.617em
    }
    .pureHeart-quality-text3{
        width: auto;
        margin: 1em 1em
    }
    .imgsection-content .imgsection{
        margin-top: 0.4em
    }
    //mobile-section3
    .pureHeart-principle-img{
        width: 2.5em;
        height: 2.5em;
        margin-left: 2.666em
    }
    .pureHeart-principle-img1{
        margin-left: 1em
    }
    .pureHeart-principle-text{
        .p-text-wrap{
            font-size: 12px
        }
        width: 4em;
        margin-left: 1.2em;
    }

    .pureHeart-principle-text3,.pureHeart-principle-text5{
        margin-left: 0.2em;
    }

    .pureHeart-principle-box{
        width: 4em
    }
    .pureHeart-principle-text3_1{
        margin-left: 0.85em;
    }
    .pureHeart-principle-box-text1,.pureHeart-principle-box-text2{
        .p-text-wrap{
            font-size: 12px
        }
    }
}



@media screen and (max-width: 768px) {
    .p-template_nav{
        display: none;
    }
   
 }